import { useState, useEffect, forwardRef, useImperativeHandle } from 'react';
import { Select, DatePicker } from 'antd';
import { axhelper } from '@/shared/axhelper';
import moment from 'moment';

const { RangePicker } = DatePicker;
const transDateTime = (val, fmt) => {
  if (val && !Array.isArray(val)) {
    if (val === '0001-01-01 00:00:00~0001-01-01 00:00:00') return null;
    const dt = val.split('~');
    if (dt && dt.length === 2) {
      return [moment(dt[0], fmt), moment(dt[1], fmt)];
    }
    return null;
  }
  return null;
};
/**
 * 自定义日期选择控件
 * @param label 标签
 * @param field 字段名称
 * @param axvalue 默认值
 * @param showTime 是否展示时间选项（默认false）
 * @param disabledBeforeToday 是否今天之前（默认false）
 * @param format 时间格式（默认YYYY-MM-DD HH:mm:ss）
 * @param placeholder 占位符
 */
const DatePickerForSimple = (props, ref) => {
  const {
    showTime = false,
    disabledBeforeToday = false,
    format = 'YYYY-MM-DD HH:mm:ss',
    axvalue,
    onChange,
    ...rest
  } = props;

  useImperativeHandle(ref, () => ({

  }));

  useEffect(() => {
    if (onChange) {
      onChange((axvalue && moment(axvalue, format)) || undefined, axvalue);
    }
  }, [axvalue]);

  const range = (start, end) => {
    const result = [];
    for (let i = start; i < end; i++) {
      result.push(i);
    }
    return result;
  };

  const disabledDate = current => {
    if (disabledBeforeToday === true) {
      const date = new Date();
      const year = date.getFullYear();
      const month = date.getMonth();
      const day = date.getDate();
      // Can not select days before today and today
      return current && current < new Date(year, month, day);
    } else {
      return false;
    }
  };

  const disabledDateTime = e => {
    if (disabledBeforeToday === true) {
      const hour = new Date().getHours();
      const date = new Date().getDate();
      if (e === undefined || (e && e.date() && e.date() === date)) {
        return {
          disabledHours: () => range(0, hour),
          // disabledMinutes: () => range(30, 60),
          // disabledSeconds: () => [55, 56],
        };
      } else {
        return '-';
      }
    } else {
      return '-';
    }
  };

  const handleChange = (m, val) => {
    m && (m._f = format);
    if (onChange) {
      onChange(m || undefined, val);
    }
  };

  return (
    <DatePicker
      allowClear
      disabledDate={disabledDate}
      disabledTime={disabledDateTime}
      showTime={showTime}
      format={format}
      style={{ width: '100%' }}
      placeholder={props.placeholder ? props.placeholder : `请选择${props.label}`}
      onChange={handleChange}
      {...rest}
    />
  );
}

const AxDatePickerForSimple = forwardRef(DatePickerForSimple);

/**
 * 自定义日期选择控件
 * @param label 标签
 * @param field 字段名称
 * @param axvalue 默认值
 * @param showTime 是否展示时间选项（默认false）
 * @param disabledBeforeToday 是否今天之前（默认false）
 * @param format 时间格式（默认YYYY-MM-DD HH:mm:ss）
 * @param placeholder 占位符
 */
const DateRangePickerForSimple = (props, ref) => {
  const {
    showTime = false,
    disabledBeforeToday = false,
    format = 'YYYY-MM-DD HH:mm:ss',
    axvalue,
    onChange,
    ...rest
  } = props;

  useImperativeHandle(ref, () => ({

  }));

  useEffect(() => {
    if (onChange) {
      onChange((axvalue && transDateTime(axvalue, format)) || undefined, axvalue);
    }
  }, [axvalue]);

  const range = (start, end) => {
    const result = [];
    for (let i = start; i < end; i++) {
      result.push(i);
    }
    return result;
  };

  const handleChange = (m, val) => {
    m && (m._f = format);
    if (onChange) {
      onChange(m || undefined, val);
    }
  };

  return (
    <RangePicker
      allowClear
      showTime={showTime}
      format={format}
      style={{ width: '100%' }}
      placeholder={props.placeholder ? props.placeholder : [`${props.label}从`, `${props.label}到`]}
      onChange={handleChange}
      fieldDecoratorOptions={{
        getValueFromEvent: (args) => {
          if (args) {
            args._f = format;
          }
          return args;
        },
      }}
      {...rest}
    />
  );
}

const AxDateRangePickerForSimple = forwardRef(DateRangePickerForSimple);

export {
  AxDatePickerForSimple,
  AxDateRangePickerForSimple,
}
